<template>
<div class='app-container'>
    <el-input placeholder="输入关键字进行过滤" v-model="filterText">
    </el-input>
    <el-tree :data="subjectList" :props="defaultProps" @node-click="handleNoceClick" ref="tree" :filter-node-method="filterNode">

    </el-tree>
</div>
</template>

<script>
import SubjectApi from '@/api/subject'
export default {
    name: '',
    props: {},
    components: {},
    data() {
        return {
            filterText: '', //过滤文本
            subjectList: [], //数据列表
            defaultProps: {
                children: 'children',
                label: 'title'
            }
        };
    },
    computed: {},
    //监听器
    watch: {
        filterText(val) {
            this.$refs.tree.filter(val);
        }
    },
    methods: {
        //获取所有节点数据
        getSubjectTreeList() {
            SubjectApi.getSubjectTreeList().then(req => {
                this.subjectList = req.data.items
            })
        },
        //节点点击触发
        handleNoceClick() {

        },
        //过滤
        filterNode(value, data) {
            if (!value) return true;
            return data.title.toLowerCase().indexOf(value.toLowerCase()) !== -1;
        }
    },
    created() {
        this.getSubjectTreeList()
    },
    mounted() {},
    beforeDestroy() {}
};
</script>

<style>
</style>
